$sizes: (
        "xs":5px,
        "s":10px,
        "m":15px,
        "l":20px,
        "xl":30px
);


@each $spec,$size in $sizes {
  .pd-#{$spec}{
    padding: $size;
  }
  .pd-t-#{$spec} {
    padding-top: $size;
  }
  .pd-r-#{$spec} {
    padding-right: $size;
  }
  .pd-b-#{$spec} {
    padding-bottom: $size;
  }
  .pd-l-#{$spec} {
    padding-left: $size;
  }

  .mr-#{$spec}{
    margin: $size;
  }
  .mr-t-#{$spec} {
    margin-top: $size;
  }
  .mr-r-#{$spec} {
    margin-right: $size;
  }
  .mr-b-#{$spec} {
    margin-bottom: $size;
  }
  .mr-l-#{$spec} {
    margin-left: $size;
  }

}